<template>
  <div class="main">
    <div class="bigBg">
      <div class="w">
        <div class="title">合作院校</div>
        <ul>
          <li v-for="item in li" :key="item.id">
            <img :src="$store.state.apiFile+item.logo" alt="">
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import { SCHOOLLIST } from "@/api/api";
import { _axios } from "@/api/_axios";
export default {
  components: {
  },

  data() {
    return {
      name: "",
      li: [],
    };
  },
  mounted() {
    this.getSchool();
  },
  methods: {
    getSchool() {
      _axios(
        SCHOOLLIST,
        {
          page: 1,
          limit: 999,
        },
        "get"
      ).then((res) => {
        console.log(res, "学校");
        if (res.code == 0) {
          this.li = res.data;
        }
      });
    },
  },
};
</script>


<style scoped>
.bigBg {
  width: 100%;
  height: 100%;
  background-color: #eee;
  padding-bottom: 50px;
}
.bigBg .title {
  font-size: 36px;
  color: #333333;
  position: relative;
  text-align: center;
  padding-top: 80px;
  padding-bottom: 50px;
}
.bigBg ul {
  min-height: 400px;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.bigBg ul li {
  width: 285px;
  height: 145px;
  line-height: 145px;
  margin-right: 20px;
  margin-bottom: 20px;
  padding: 30px;
  box-sizing: border-box;
  background-color: #fff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.bigBg ul li:nth-child(4n){
  margin-right: 0;
}
.bigBg ul li img {
  width: 100%;
  /* height: 100%; */
}
</style>
